/**
 * 新建方案
 * @type {[type]}
 */

 import React,{PropTypes,Component,PureComponent}  from 'react';
 import {Select ,Button ,Tree ,Modal, Form, Input, TreeSelect,Row,Col } from 'antd';
 import { connect } from 'react-redux';

 const FormItem = Form.Item;

const NewSchemeCreateForm = Form.create()(
  (props) => {
  const { visible, onCancel, onCreate, form } = props;
  const { getFieldDecorator } = form;
  return (
    visible?
     <Modal
       visible={visible}
         title="新增"
         okText="提交"
         onCancel={onCancel}
         onOk={onCreate}
     >
       <Form layout="vertical">
         <FormItem label="">
           {getFieldDecorator('schemeName', {
             rules: [
               { required: true, whitespace: true, message: '请输入方案名称!' },
             ],
           })(
             <Input placeholder="请输入方案名称"/>,
             )}
         </FormItem>
       </Form>
     </Modal> : null
   );
 }
)


const mapStateToProps = state => ({

});
const mapDispatchToProps = {
 addnewPlan: query => ({
   type: 'fundpool/addnewPlan',
   payload: query || {},
 })
};

@connect( null,mapDispatchToProps)
class NewPlanFit extends PureComponent {

 static propTypes = {
   form: PropTypes.object.isRequired,
   addnewPlan: PropTypes.func.isRequired,
 }
 constructor(props) {
   super(props);
   this.state = {
     visible: false,
   };
 }


 showModal = () => {
   this.setState({ visible: true });
 }

 handleCancel = () => {
   this.setState({ visible: false });
 }

 handleCreate = () => {
   const form = this.form;
   const { addnewPlan,getFilter } = this.props;
   form.validateFields((err, values) => {
     if (err) {
       return;
     }
     console.log('新建方案>>>Received values of form: ', values);
     form.resetFields();
     addnewPlan({
       ...values,
       "schemeKpis":[
         {
           "kpiName":"establishAge"
         },
         {
           "kpiName":"investStrategy"
         },
         {
           "kpiName":"status"
         },
         {
           "kpiName":"annualYieldRate"
         },
         {
           "kpiName":"volatility"
         },
         {
           "kpiName":"sharpeRatio"
         }
       ]
     })

     this.setState({ visible: false });
   });
 }

 saveFormRef = (form) => {
   this.form = form;
 }
 render() {

   return (
     <div>
       <Button type="primary" onClick={this.showModal}>新建方案</Button>
       <NewSchemeCreateForm
         ref={this.saveFormRef}
         visible={this.state.visible}
         onCancel={this.handleCancel}
         onCreate={this.handleCreate}
       />
     </div>
   );
 }
}
export default Form.create({
})(NewPlanFit);
